<!DOCTYPE html>
<script src="../../resources/check-layout.js"></script>
<style>
    .box { height:40px; background:blue; }
</style>
<p>If min-height is larger than height, the final height will be set according to
    min-height. Content should fill columns to their full height (the same as the height of the
    multicol container), since we request column-fill:auto, and height is non-auto, so we won't
    balance.</p>
<p>Below there should be a blue square to the left of a hotpink square.</p>
<div id="test" style="position:relative; -webkit-columns:4; -webkit-column-gap:0; column-fill:auto; width:160px; height:40px; min-height:80px; background:hotpink;">
    <div data-offset-y="0" class="box"></div>
    <div data-offset-y="40" class="box"></div>
    <div data-offset-y="0" class="box"></div>
    <div data-offset-y="40" class="box"></div>
</div>
<script>
    checkLayout("#test");
</script>
